/**
 * Created by henian.xu on 2018/8/31.
 * 劫持下拉菜单滚动条
 */

export default {
    data() {
        return {
            onHandleScrollOld: null,
            loadStatus: '',
            isLoading: false,
        };
    },
    computed: {
        $$scrollbar() {
            return this.$$select.$refs.scrollbar;
        },
        isComplete() {
            return this.loadStatus === 'complete';
        },
    },
    methods: {
        onScroll() {
            if (!this.isLoading && !this.isComplete) {
                this.attemptLoad();
            }
            this.onHandleScrollOld();
        },
        attemptLoad() {
            const { $$scrollbar } = this;
            const { wrap } = $$scrollbar;
            const { scrollTop, scrollHeight, clientHeight } = wrap;
            if (scrollTop + clientHeight === scrollHeight) {
                // console.log('bottom');
                this.isLoading = true;
                this.onLoad().then(loadStatus => {
                    // console.log('loadStatus', loadStatus);
                    this.loadStatus = loadStatus;
                    this.isLoading = false;
                });
            } else if (scrollTop === 0) {
                // console.log('top');
                // console.log(scrollTop, clientHeight, scrollHeight);
            }
        },
    },
    mounted() {
        this.onHandleScrollOld = this.$$scrollbar.handleScroll.bind(this.$$scrollbar);
        // 事件劫持
        this.$$scrollbar.handleScroll = this.onScroll;
    },
};
